<template>
	<view>
		<template v-if="loginStuatus">
			<uni-list-item showArrow title="账号与安全" link @click="open({path:'user-safe',auth:true})"></uni-list-item>
			<uni-list-item showArrow title="资料编辑" link @click="open({path:'user-userinfo',auth:true})"></uni-list-item>
		</template>	
		<uni-list-item showArrow title="清除缓存" link @click="clearStorgeInfo">
			<text slot="right"class="text-muted mr-2">{{storageInfo|format}}</text>
		</uni-list-item>
		<uni-list-item v-if="loginStuatus" showArrow title="意见反馈" link @click="open({path:'user-feedback',auth:true})"></uni-list-item>
		<uni-list-item showArrow title="关于树洞" link @click="open({path:'about',auth:false})"></uni-list-item>
		<view class="pt-4 px-2" @click="loginOut">
			<view class="bg-main text-white p-2 text-center" style="border-radius: 50rpx;" v-if="loginStuatus">
				退出登录
			</view>
		</view>
	</view>
</template>

<script>
	import uniListItem from '@/components/uni-ui/uni-list-item/uni-list-item.vue'
	import {mapState} from 'vuex'
	export default {
		components: {
			uniListItem,
		},
		data() {
			return {
				storageInfo:'0'
			}
		},
		onLoad() {
			this.getStorageInfo()

		},
		filters: {
			format(value) {
				return value > 1024 ? value / 1024 + 'MB' : value + 'KB'
			}
		},
		computed:{
			...mapState(['loginStuatus'])
		},
		methods: {
			open({path,auth=false}) {
				// console.log(path)
				// return
				if(auth){
					this.checkAuth(()=>{
						uni.navigateTo({
							url: `../${path}/${path}`,
						});
					})
				}
				uni.navigateTo({
					url: `../${path}/${path}`,
				});
			},
			//获取本地缓存
			getStorageInfo(){
				const res = uni.getStorageInfoSync();
				this.storageInfo = res.currentSize
			},
			//清除缓存
			clearStorgeInfo(){
				uni.showModal({
					title: '提示',
					content: '是否要清除全部缓存',
					cancelText: '否',
					confirmText: '是',
					success: res => {
						if(res.confirm){
							uni.clearStorageSync()
							this.getStorageInfo()
							uni.showToast({
								title: '清除成功',
								icon:'none'
							});
						}
					},
				});
			},
			loginOut(){
				uni.showModal({
					title: '你能确定要登出当前账户吗？',
					cancelText: '否',
					confirmText: '是',
					success: res => {
						this.$store.commit('loginOut')
						this.$store.dispatch('closeSocket')
						uni.navigateBack({
							delta: 1
						});
						uni.showToast({
							title: '退出成功',
							icon: 'none'
						});
					},
				});
			}
		}	
	}
</script>

<style>

</style>
